import 'package:flutter/material.dart';
import 'package:shining_red_star/widgets/balloon.dart';
import '../definitions/color.dart';
import '../model/color.dart';
import 'focus_manage/focus_widget.dart';

class ColorIndexCard extends StatefulWidget {
  final ColorInfo color;
  final FocusNode focusNode;
  final bool? autofocus;
  final void Function()? onConfirm;

  ColorIndexCard({
    super.key,
    required this.color,
    this.autofocus,
    this.onConfirm,
    FocusNode? focusNode,
  }) : focusNode = focusNode ?? FocusNode();

  @override
  State<ColorIndexCard> createState() => _ColorIndexCardState();
}

class _ColorIndexCardState extends State<ColorIndexCard> {
  @override
  Widget build(BuildContext context) {
    bool showFocusStatus = widget.focusNode.hasFocus;
    return FocusWidget(
        focusNode: widget.focusNode,
        autofocus: widget.autofocus,
        onConfirm: widget.onConfirm,
        onFocusChange: (bool value) {
          setState(() {});
        },
        child: Container(
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10),
              border: Border.all(
                  color: showFocusStatus
                      ? SchemeColor.seedColor.value
                      : Colors.white30)),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Balloon(
                color: widget.color.color,
              ),
              Text(
                widget.color.value,
                style: TextStyle(
                  height: 1,
                  fontSize: 18,
                  fontWeight: showFocusStatus ? FontWeight.bold : null,
                  color: showFocusStatus ? SchemeColor.seedColor.value : null,
                ),
              )
            ],
          ),
        ));
  }
}
